<template>
    <div>
        <van-address-list
             v-model="chosenAddressId"
            :list="list"
            :disabled-list="disabledList"
            default-tag-text="默认"
            @edit="onEdit"
        />
        <van-card
            num="2"
            price="68.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
      <van-goods-action>
        <van-goods-action-icon icon="chat-o" text="客服" @click="onClickIcon" />
        <van-goods-action-icon icon="cart-o" text="购物车" @click="onClickIcon" />
        <van-goods-action-icon icon="shop-o" text="店铺" @click="onClickIcon" />
        <van-goods-action-button
            type="danger"
            text="立即购买"
            @click="onClickButton"
     />
</van-goods-action>
</div>
</template>

<script>
import { Toast } from 'vant';

export default {
  data() {
    return {
      chosenAddressId: '1',
      list: [
        {
          id: '1',
          name: '张三',
          tel: '13000000000',
          address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室',
          isDefault: true,
        },
        {
          id: '2',
          name: '李四',
          tel: '1310000000',
          address: '浙江省杭州市拱墅区莫干山路 50 号',
        },
      ],
    };
  },
  methods: {
    onEdit(item, index) {
      Toast('编辑地址:' + index);
    },
      onClickIcon() {
      Toast('点击图标');
    },
    onClickButton() {
      Toast('点击按钮');
    },
  },
};
</script>

<style lang="less" scoped>
.van-address-list__bottom{
    position: fixed;
    bottom: 500px;
    left: 0;
    
}
</style>